/**
 * @desc:资金明细
 * @author:binlety
 * * */
import React, { useState, useEffect, useMemo } from 'react'
import { useLocation } from 'react-router-dom';
import TableList from './component/TableList'
import FormRender from '@/components/FormRender';
import { getFormItem } from './config.js';
import { useResize } from '@/hooks/useResize';
import CommonPagination from '@/components/CommonPagination';
import { getTableListFunc } from './service';
import moment from 'moment';
import { isEmpty } from 'lodash';
import './index.less'; //控制表格filter css

const dateFormat = 'YYYY-MM-DD HH:mm:ss';
const initQuery = {
  time: [moment().startOf('day').subtract(0, 'days'), moment().endOf('day')]
}
const initPagination = {
  current: 1,
  total: 0,
  pageSize: 10,
  showSizeChange: true,
  showQuickJumper: true,
}//分页

let userIdentity; //用户类型 1 普通用户  2 仓储用户

const CapitalDetail = () => {

  const [loading, setLoading] = useState(false);
  const [query, setQuery] = useState({ ...initQuery });//表单参数
  const [filter, setFilter] = useState({});//表格参数
  const [data, setData] = useState([])//表格list
  const [pagination, setPagination] = useState({})//分页

  const location = useLocation();

  //监听变更
  const { el: headerEl, height: headerHeight } = useResize();

  //表单数据
  const formArr = useMemo(() => {
    return getFormItem();
  }, [])

  useEffect(() => {
    if (location.state?.userIdentity) {
      setQuery({ payOrderSn: location.state.query })
      userIdentity = location.state.userIdentity
      localStorage.setItem('userIdentity', location.state.userIdentity);
      setPagination({ ...initPagination })
    }
  }, [location.state])

  useEffect(() => {
    if (!isEmpty(pagination)) {
      getTableList()
    }
  }, [pagination])

  //获取表格数据
  const getTableList = async () => {
    if (!loading) {
      START_LOADING()
    }
    const params = { ...query }
    if (params.time) {
      params.beginTime = moment(params.time[0]._d).format(dateFormat);
      params.beginTime1 = moment(params.time[1]._d).format(dateFormat);
    }
    params.time = undefined
    const { data, success } = await getTableListFunc({
      ...params,
      ...filter,
      userIdentity: userIdentity || localStorage.getItem('userIdentity'),
      current: pagination.current,
      size: pagination.pageSize
    })
    if (success) {
      const { records, total } = data
      pagination.total = total
      setPagination(pagination)
      setData(records)
    } else {
      setData([])
      pagination.total = 0
      pagination.current = 1
      setPagination(pagination)
    }
    END_LOADING()
  }

  //表单渲染组件
  const FormRenderProps = {
    query,
    formArr,
    formConfig: {
      name: 'child-account-manage-form',
      style: { marginBottom: '16px' }
    },
    clickSearch(value) {
      if (value.time) {
        setQuery(value)
      } else {
        setQuery({ ...value, time: [moment().startOf('day').subtract(90, 'days'), moment().endOf('day')] })
      }
      setPagination({
        ...pagination,
        current: 1
      })
    },
    clickReset() {
      setQuery({ ...initQuery })
      setPagination({
        ...pagination,
        current: 1
      })
    },
  }

  //表格
  const TableProps = {
    query,//导出use
    filter,
    data,
    headerHeight,
    updateFilter(params) {//过滤
      setFilter(params)
      setPagination({
        ...pagination,
        current: 1
      })
    }
  }

  //分页
  const pageProps = {
    pagination,
    style: {
      marginTop: '12px'
    },
    handleChange(current, size) {
      setPagination({
        ...pagination,
        current,
        pageSize: size
      })
    }
  }

  return (
    <>
      <div ref={headerEl}>
        <FormRender {...FormRenderProps} />
      </div>
      <div className='global-page-wrap'>
        <TableList {...TableProps} />
        <CommonPagination {...pageProps} />
      </div>
    </>
  )
}

export default React.memo(CapitalDetail, (prev, next) => {
  if (isEmpty(next.location.state)) {
    // console.log(next.location.state,'缓存')
    return true
  }
  //  console.log('更新')
  return false
})